import React from "react";
import Home from "../components/Home";
import About from "../components/About";
import AddOrEdit from "../components/AddOrEdit";
import Detail from "../components/Detail";
import Email from "../components/Email";
import Phone from "../components/Phone";
import { useRoutes,Navigate } from "react-router-dom";

function Route(props) {
  return useRoutes([
    {
      path: "/home",
      element: <Home />,
    },
    {
      path: "/about",
      element: <About />,
      children: [
        {
          path: "email",
          element: <Email />,
        },
        {
          path: "Phone",
          element: <Phone />,
        },
        {
          path: "",
          element: <Navigate replace to="email"/>,
        },
      ],
    },
    {
      path: "/add",
      element: <AddOrEdit />,
    },
    {
      path: "/edit/:id",
      element: <AddOrEdit />,
    },
    {
      path: "/detail/:id",
      element: <Detail />,
    },
    {
      path: "",
      element: <Home />,
    },
  ]);
}

export default Route;
